<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>修改密码</title>
  <script src="./js/cookie.js"></script>
  <script src="./js/requset.js"></script>
</head>

<body>
  <form>
    <table align="center">
      <caption>
        <h2>修改密码</h2>
      </caption>
      <tr>
        <td>用户名：</td>
        <td><input type="text" name="username"></td>
      </tr>
      <tr>
        <td>旧密码：</td>
        <td><input type="password" name="password"></td>
      </tr>
      <tr>
        <td>新密码：</td>
        <td><input type="password" name="repass"></td>
      </tr>
      <tr>
        <td></td>
        <td>
          <input type="reset">
          <input type="submit">
        </td>
      </tr>
    </table>
  </form>
  <script>
    var form = document.querySelector('form')
    form.onsubmit = function (event) {
      event.preventDefault()
      var username = document.querySelector('[name="username"]').value
      var password = document.querySelector('[name="password"]').value
      var repass = document.querySelector('[name="repass"]').value
      var usernameReg = /^[a-zA-Z][a-zA-Z0-9]{3,9}$/
      if (!usernameReg.test(username)) {
        alert('用户名不符合规则')
        return false
      }
      var passwordReg = /^.{6,10}$/
      if (!passwordReg.test(password)) {
        alert('密码不符合规则')
        return false
      }
      if (!passwordReg.test(repass)) {
        alert('密码不符合规则')
        return false
      }
      request({
        url: '/user/pass',
        method: 'post',
        data: {
          _id:getCookie('userid'),
          'username':username,
          'password': password,
          'repass':repass
        },
        headers: {
          Authorization: localStorage.getItem('token')
        }
      }).then(res => {
        alert(res.msg)
        location.href = '/index.html'
      })
      // 阻止默认行为，不允许表单跳转
      // return false
    }
  </script>
</body>

</html>